<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org"
      lang="zh-cn">
<head>
    <meta content="云之讯,云通讯,云通讯平台" name="keywords"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1"/>
    <title>短信平台运营系统 - 管理员中心</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
    <link th:href="@{/resources/css/bootstrap.min14ed.css?v=3.3.6}" rel="stylesheet">
    <!--<link th:href="@{/resources/css/jquery.datetimepicker.css}" rel="stylesheet">-->

    <link th:href="@{/resources/css/font-awesome.min93e3.css?v=4.4.0}" rel="stylesheet"><!-- jqgrid-->
    <link th:href="@{/resources/js/plugins/jqgrid/css/ui.jqgrid-bootstrap.css}" rel="stylesheet">
    <link th:href="@{/resources/css/animate.min.css}" rel="stylesheet">
    <link th:href="@{/resources/css/timePicker.css}" rel="stylesheet">
    <link th:href="@{/resources/css/style.min862f.css?v=4.1.0}" rel="stylesheet">
    <link th:href="@{/resources/css/plugins/sweetalert/sweetalert.css}" rel="stylesheet">

    <style>
        /* Additional style to fix warning dialog position */
        body{
            width:769px;
        }
        .container-fluid{
            background-color:#FFF;
        }
        .page-title{
            padding: 20px 0;
            position: relative;
            z-index:10;
        }
        .page-title .line{
            position: absolute;
            width:100%;
            height:1px;
            background-color: #DDD;
            left:0;
            top:50%;
        }
        .page-title .title{
            padding-left:5px;
            padding-right:5px;
            border-left:10px solid #0a8000;
            position: relative;
            z-index:11;
            display: inline-block;
            background-color: #FFF;
        }
        .checkbox input[type=checkbox], .checkbox-inline input[type=checkbox], .radio input[type=radio], .radio-inline input[type=radio]{
            margin-top:0;
        }
        .port{
            width:55px;
            display: inline-block;
        }
    </style>
</head>
<body class="gray-bg"><div th:replace="stat :: statCode"></div>
<div class="container-fluid animated fadeInRight">
    <div class="row">
        <div class="col-xs-12">
            <input type="text" style="position: fixed;top:-999999px;">
            <input type="password" style="position: fixed;top:-999999px;">
            <div class="form-horizontal">
                <div class="page-title">
                    <span class="title">应用信息</span>
                    <span class="line"></span>
                </div>
                <!-- 用途 -->
                <div class="form-group">
                    <label class="col-xs-3 control-label">用途：</label>
                    <div class="col-xs-5">
                        <input type="text" name="alarmName" class="form-control js-alarmName">
                    </div>
                </div>
                <!-- 应用系统 -->
                <div class="form-group">
                    <label class="col-xs-3 control-label">应用系统：</label>
                    <div class="col-xs-8">
                        <label class="checkbox-inline">
                            <input type="radio" name="webId" class="js-webId" value="4"> 用户中心
                        </label>
                        <label class="checkbox-inline">
                            <input type="radio" name="webId" class="js-webId" value="5"> OEM客户端
                        </label>
                        <label class="checkbox-inline">
                            <input type="radio" name="webId" class="js-webId" value="2"> 品牌代理商平台
                        </label>
                        <label class="checkbox-inline">
                            <input type="radio" name="webId" class="js-webId" value="6"> 品牌客户端平台
                        </label>
                        <label class="checkbox-inline">
                            <input type="radio" name="webId" class="js-webId" value="3"> 运营平台
                        </label>
                    </div>
                </div>
                <!-- 服务器信息 -->
                <div class="page-title">
                    <span class="title">服务器信息</span>
                    <span class="line"></span>
                </div>
                <!--账户类型-->
                <div class="form-group">
                    <label class="col-xs-3 control-label">账户类型：</label>
                    <div class="col-xs-5">
                        <select class="form-control js-mailboxType" name="mailboxType">
                            <option value="0">POP3</option>
                            <option value="1">IMAP</option>
                        </select>
                    </div>
                </div>
                <!-- 接受邮件服务器 -->
                <div class="form-group">
                    <label class="col-xs-3 control-label">接受邮件服务器：</label>
                    <div class="col-xs-5">
                        <input type="text" name="incomingMailServer" class="form-control js-incomingMailServer">
                    </div>
                    <div class="col-xs-4">
                        <label class="control-label">端口：</label>
                        <input type="text" class="form-control port js-incomingPort">
                    </div>
                </div>
                <!-- 发送邮件服务器 -->
                <div class="form-group">
                    <label class="col-xs-3 control-label">发送邮件服务器：</label>
                    <div class="col-xs-5">
                        <input type="text" name="outgoingMailServer" class="form-control js-outgoingMailServer">
                    </div>
                    <div class="col-xs-4">
                        <label class="control-label">端口：</label>
                        <input type="text" class="form-control port js-outgoingPort">
                    </div>
                </div>
                <!-- 用户信息 -->
                <div class="page-title">
                    <span class="title">用户信息</span>
                    <span class="line"></span>
                </div>
                <!-- 电子邮箱地址 -->
                <div class="form-group">
                    <label class="col-xs-3 control-label">电子邮箱地址：</label>
                    <div class="col-xs-5">
                        <input type="text" name="emailAddress" class="form-control js-emailAddress">
                    </div>
                </div>
                <!-- 用户名 -->
                <div class="form-group">
                    <label class="col-xs-3 control-label">用户名(U)：</label>
                    <div class="col-xs-5">
                        <input type="text" name="emailUsername" class="form-control js-emailUsername">
                    </div>
                </div>
                <!-- 密码 -->
                <div class="form-group">
                    <label class="col-xs-3 control-label">密码(P)：</label>
                    <div class="col-xs-5">
                        <input type="password" name="emailPassword" class="form-control js-emailPassword">
                    </div>
                </div>
                <!-- 邮件测试 -->
                <div class="form-group">
                    <label class="col-xs-3 control-label">邮件测试：</label>
                    <div class="col-xs-5">
                        <a href="javascript:;" class="btn btn-primary js-test">开始测试</a>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-xs-3 control-label"></label>
                    <div class="col-xs-5">
                        <a href="javascript:;" class="btn btn-primary js-confirm">确定</a>
                        <a href="javascript:;" class="btn btn-default js-cancel" style="margin-left:30px;">取消</a>
                    </div>
                </div>
            </div>

        </div>
    </div>
</div>


<!--<script th:src="@{/resources/js/jquery.min.js?v=2.1.4}"></script>-->
<script th:src="@{/resources/js/jquery.1.7.2.min.js?v=2.1.4}"></script>
<script th:src="@{/resources/js/bootstrap.min.js?v=3.3.6}"></script>
<script th:src="@{/resources/js/jquery.datetimepicker.full.min.js}"></script>
<script th:src="@{/resources/js/plugins/timePicker/jquery.timePicker.js}"></script>
<script th:src="@{/resources/js/plugins/layer/laydate/laydate.js}"></script>
<script th:src="@{/resources/js/layer/layer.js}"></script>
<script th:src="@{/resources/js/plugins/peity/jquery.peity.min.js}"></script>
<script th:src="@{/resources/js/plugins/jqgrid/js/i18n/grid.locale-cn.js}"></script>
<script th:src="@{/resources/js/plugins/jqgrid/js/jquery.jqGrid.min.js}"></script>
<script th:src="@{/resources/js/content.min.js?v=1.0.0}"></script>
<script th:src="@{/resources/js/plugins/sweetalert/sweetalert.min.js}"></script>
<script th:src="@{/resources/js/auth.js}"></script>
<script th:src="@{/resources/js/date_format.min.js?v=1.0.0}"></script>
<script th:src="@{/resources/js/common.js?v=1.0.0}"></script>
<script th:inline="javascript">
    /*<![CDATA[*/

    $(document).ready(function () {

        $(".js-confirm").click(function(){
            var params = getCommitParams();
            if(!params){
                return;
            }

            $.ajax({
                url:'/managerCenter/taskAlarmSetting/email/server/add',
                type:"POST",
                contentType:"application/json",
                data:JSON.stringify(params),
                dataType:"json",
                success : function(res){
                    if(res.code !== 0){
                        layer.msg(res.msg);
                        return false;
                    }
                    var _p = parent;
                    parent.layer.msg(res.msg, {icon: 1,time: 1000},function(){
                        _p.location.reload();
                    });

                }
            })
        })

        $(".js-test").click(function(){
            var params = getCommitParams();
            if(!params){
                return;
            }
            $.ajax({
                url:'/managerCenter/taskAlarmSetting/email/server/test',
                type:"POST",
                contentType:"application/json",
                data:JSON.stringify(params),
                dataType:"json",
                success : function(res){
                    if(res.code !== 0){
                        layer.msg(res.msg);
                        return false;
                    }
                    layer.msg(res.msg,{icon:1});

                }
            })
        })

        $(".js-cancel").click(function(){
            parent.layer.closeAll();
        })
    })
    function getCommitParams(){
        var params = {};
        var imcomingPort = $(".js-incomingPort").val(),
            outgoingPort = $(".js-outgoingPort").val(),
            incomingMailServer = $(".js-incomingMailServer").val(),
            outgoingMailServer = $(".js-outgoingMailServer").val();
        params.alarmName = $(".js-alarmName").val();
        params.emailAddress = $(".js-emailAddress").val();
        params.emailPassword = $(".js-emailPassword").val();
        params.emailUsername = $(".js-emailUsername").val();
        params.mailboxType = $(".js-mailboxType").val();
        params.incomingMailServer = incomingMailServer + ":" + imcomingPort;
        params.outgoingMailServer = outgoingMailServer + ":" + outgoingPort;
        params.webId = $(".js-webId:checked").val();
        if(_Auth.isNull(params.alarmName)){
            layer.msg("邮件服务器用途不能为空",{icon:2});
            return false;
        }
        if(_Auth.isNull($(".js-webId:checked")) || _Auth.isNull($(".js-webId:checked").val())){
            layer.msg("请选择应用系统",{icon:2});
            return false;
        }
        if(!/^[0-9A-Za-z\.]{1,94}$/.test(incomingMailServer)){
            layer.msg("接收邮件服务器格式不正确",{icon:2});
            return false;
        }
        if(!/^[0-9A-Za-z\.]{1,94}$/.test(outgoingMailServer)){
            layer.msg("发送邮件服务器格式不正确",{icon:2});
            return false;
        }
        if(!_Auth.isPort(imcomingPort)){
            layer.msg("接收邮件服务器端口不正确",{icon:2});
            return false;
        }
        if(!_Auth.isPort(outgoingPort)){
            layer.msg("发送邮件服务器端口不正确",{icon:2});
            return false;
        }
        if(!_Auth.isEmail(params.emailAddress)){
            layer.msg("电子邮件地址不正确",{icon:2});
            return false;
        }
        if(params.emailUsername.length > 50 || params.emailUsername.length < 1){
            layer.msg("用户名长度不能超过50，且不能为空",{icon:2});
            return false;
        }
        if(params.emailPassword.length < 1 || params.emailPassword.length >50){
            layer.msg("密码格式为1-50位",{icon:2});
            return false;
        }

        return params;
    }

    /*]]>*/
</script>
</body>
</html>